<template>
  <view class="content">
    <view class="tab-box">
      <u-tabs :list="tabnavList" @click="tabChange" :scrollable="false" lineColor="#4871C0" :current="activeIndex"
              lineWidth="70rpx" lineHeight="5rpx" :activeStyle="{
        color: '#4871C0',
        fontWeight: 'bold',
      fontSize:'28rpx',
    }" :inactiveStyle="{
        color: '#999999',
      fontSize:'28rpx',
    }" itemStyle="padding-left: 15px; padding-right: 15px; height: 34px;width:30%;padding-bottom:10rpx;"></u-tabs>
    </view>
    <!-- 待进行 -->
    <!-- 	<view class="time-box" v-if="activeIndex == 1 || activeIndex == 0">
        <view class="tiem-tiem" v-for="(item,index) in timeList" :key="index"
          :class="activeNum === index ? 'active':''" @click="changTiem(index)">
          {{item.name}}
        </view>
        <img class="serach" src="@/static/img/serach.png" />
      </view> -->
    <!-- 待审批 -->
    <view class="time-box" v-if="activeIndex == 2">
      <view class="tiem-tiem" v-for="(item,index) in stateList" :key="index"
            :class="stateactiveNum === index ? 'active':''" @click="changstatusTiem(index)">
        {{item.name}}
      </view>
    </view>
    <!-- 通知列表 -->
    <view class="list" v-if="activeIndex == 0">
      <view class="" v-if="dataList1.length">
        <view class="list-item" v-for="(item,index) in dataList1" :key="index" @click="godetails(item.meet_id,item.type)">
          <view class="item-info">
            <view class="item-tile">
              <view class="title">{{item.title}}</view>
            </view>
            <view class="address">
              {{item.content}}
            </view>
            <view class="time" v-if="item.bohui_content == ''">
              {{item.start_time}}
              <text v-if="item.status == 1">审批通过</text>
              <text v-else-if="item.status == 2">您有新的会议需要审核</text>
              <text v-else-if="item.status == 0">审批驳回</text>

            </view>
            <view class="time" v-if="item.bohui_content != ''">
              {{item.start_time}}
              <text>{{item.bohui_content}}</text>
            </view>
          </view>
        </view>
      </view>
      <!-- 加载更多 -->
      <u-loadmore v-if="dataList1.length" :status="loadStatus" />

      <u-empty v-if="!dataList1.length && !isLoading" mode="data"
               icon="http://cdn.uviewui.com/uview/empty/car.png">
      </u-empty>
    </view>

    <!-- 待进行的列表 -->
    <view class="list" v-if="activeIndex == 1">
      <view class="" v-if="dataList2.length">
        <view class="list-item" v-for="(item,index) in dataList2" :key="index" @click="godetails(item.id)">
          <view class="item-img">
            <u--image :src="item.user.avatar" width="44rpx" height="44rpx" shape="circle">
            </u--image>
          </view>
          <view class="item-info">
            <view class="item-tile">
              <view class="title">{{item.title}}</view>
              <!-- 	<text v-if="item.status_name.index ==  1" class="state state1">待审批</text>
                <text v-if="item.status_name.index ==  2" class="state state5">审核不通过</text>
                <text v-if="item.status_name.index ==  3" class="state state6">待进行</text>
                <text v-if="item.status_name.index ==  4" class="state state4">进行中</text>
                <text v-if="item.status_name.index ==  5" class="state state3">已结束</text>
                <text v-if="item.status_name.index ==  0" class="state state3">已取消</text> -->
              <text v-if="item.status == 1" class="state state1">待进行</text>
              <text v-if="item.status == 8" class="state state1">进行中</text>
            </view>
            <view class="address">
              {{item.type_name}} | {{item.room.title}}
            </view>
            <view class="time">
              {{item.time}}
            </view>
          </view>
        </view>
      </view>
      <!-- 加载更多 -->
      <u-loadmore v-if="dataList2.length" :status="loadStatus" />

      <u-empty v-if="!dataList2.length && !isLoading" mode="data"
               icon="http://cdn.uviewui.com/uview/empty/car.png">
      </u-empty>
    </view>

    <!-- 待审批列表 -->
    <view class="list" v-if="activeIndex == 2">
      <view class="" v-if="dataList3.length">
        <view class="list-item" v-for="(item,index) in dataList3" :key="index" @tap="godetails(item.id)">
          <!-- <view class="item-img">
            <u--image src="https://cdn.uviewui.com/uview/album/1.jpg" shape="circle" width="44rpx"
              height="44rpx">
            </u--image>
          </view> -->
          <view class="item-info">
            <view class="item-tile">
              <view class="title title1">{{item.title}}</view>
            </view>
            <view class="address" style="margin: 18rpx 0;">
              {{item.type_name}}    |    {{item.room.title}}
            </view>
            <view class="time u-flex">
              <text>{{item.time}}</text>
            </view>
            <!--发起人 -->
            <!-- <view class="" v-if="item.user_id === user_id">
              <view class="approved-tip">
                03.26 15:26 审核通过
              </view>
              <view class="audit-failed">
                <view class="audit-failed-time">
                  03.26 15:26 审核失败
                </view>
                <view class="audit-failed-content" v-if="item.meet_check">
                  拒绝理由：{{item.meet_check.content}}
                </view>
              </view>
            </view> -->
            <!-- 管理员身份不显示按钮 -->
            <!-- 校长身份按钮 -->
            <view class="item-button">
              <!-- 校长审核议题 -->
              <text v-if="item.role_type==4" @tap.stop="gotopicDetails(item.id)">议题详情</text>
              <!-- 签发人审核会议纪要 v-if="item.role_type==6" -->
              <text  v-if="item.role_type==6"  @tap.stop="gotomeetingMinutes(item.id)">审核会议纪要</text>
            </view>
          </view>
        </view>
      </view>
      <!-- 加载更多 -->
      <u-loadmore v-if="dataList3.length" :status="loadStatus" />

      <u-empty v-if="!dataList3.length && !isLoading" mode="data"
               icon="http://cdn.uviewui.com/uview/empty/car.png">
      </u-empty>
    </view>



    <myTabBar :list='tabList' :currentIndex="0"></myTabBar>
  </view>
</template>

<script>
import myTabBar from '../../../component/customTabBar/customTabBar.vue'
import {
  getMeetwaitList,
  getMeetnoticeList,
  getMeetcheckList
} from '@/api/meetApi.js'
import {
  getUser
} from '@/api/userApi.js'
export default {
  components:{
    myTabBar
  },
  data() {
    return {
      tabList:[
        {title:"代办",url:"/pages/tabbar/tabbar-3/daiban",icon:"list-dot"},
        {title:"会议室",url:"/pages/tabbar/tabbar-3/huiyishi",icon:"home"},
        {title:"我的会议",url:"/pages/tabbar/tabbar-3/myhuiyi",icon:"account"}
      ],
      token:'',
      tabnavList: [{
        name: '通知',
      }, {
        name: '待进行',
      }, {
        name: '待审批'
      }],
      activeIndex: 0,
      timeList: [{
        name: "全部 6"
      },
        {
          name: "今天 2"
        },
        {
          name: "明天 2"
        },
        {
          name: "本周 2"
        }
      ],
      activeNum: 0,
      stateList: [{
        name: "待审批"
      },
        {
          name: "已通过"
        },
        {
          name: "已驳回"
        }
      ],
      isLoading: true,
      stateactiveNum: 0,
      page: 1,
      limit: 12,
      lastPage: 0,
      // 通知列表
      dataList1: [],
      day: '',
      // 待进行列表
      dataList2: [],
      // 待审批列表
      dataList3: [],
      loadStatus: '',
      title: '',
      statusQuery: 2,
      loadStatus: ''
    }
  },
  created() {
    console.log("==========thos成功课11",uni.getStorageSync("token")||window.location.href.indexOf('code'));
    if(uni.getStorageSync("token")||window.location.href.indexOf('code')){
      this.getDataList1();
    }
  },
  onLoad(options) {
    let token = uni.getStorageSync('token')
    if(options.token && !token){
      this.token = options.token;
      uni.setStorageSync('token', this.token);
      this.getUser()
    }
    // 获取待进行列表
    this.getDataList1()
    // this.getDataList2()
    // this.getDataList3()
  },
  onReachBottom: function() {
    if (this.page < this.lastPage) {
      this.page += 1;
      this.getDataList2();
    }
  },
  methods: {
    // 获取用户信息
    getUser(){
      let params = {
        token: this.token
      };
      getUser(params).then(res => {
        console.log(res)
      })
    },
    // 获取通知列表
    getDataList1() {
      this.loadStatus = 'loading';
      this.isLoading = true;
      let params = {
        page: this.page,
        limit: this.limit,
        day: this.activeNum,
		meet_type:1,
      };
      getMeetnoticeList(params).then(res => {
        this.isLoading = false;
        uni.stopPullDownRefresh();
        console.log(res)
        this.lastPage = res.data.last_page
        this.loadStatus = this.currentPage < res.data.last_page ? 'loadmore' : 'nomore';
        this.dataList1 = [...this.dataList1, ...res.data.data]
      })
    },
    // 获取待进行列表
    getDataList2() {
      this.loadStatus = 'loading';
      this.isLoading = true;
      let params = {
        page: this.page,
		meet_type:1,
        limit: this.limit
      };
      getMeetwaitList(params).then(res => {
        this.isLoading = false;
        uni.stopPullDownRefresh();
        console.log(res)
        this.lastPage = res.data.last_page
        this.loadStatus = this.currentPage < res.data.last_page ? 'loadmore' : 'nomore';
        this.dataList2 = [...this.dataList2, ...res.data.data]
      })
    },
    // 获取待审批列表
    getDataList3() {
      this.loadStatus = 'loading';
      this.isLoading = true;
      let params = {
        page: this.page,
		meet_type:1,
        limit: this.limit,
        status: this.statusQuery,
        day: '',
        title: this.title
      };
      getMeetcheckList(params).then(res => {
        this.isLoading = false;
        uni.stopPullDownRefresh();
        console.log(res)
        this.lastPage = res.data.last_page
        this.loadStatus = this.currentPage < res.data.last_page ? 'loadmore' : 'nomore';
        this.dataList3 = [...this.dataList3, ...res.data.data]
      })
    },
    // 重置数据
    resetData() {
      this.page = "";
      this.lastPage = "";
      this.loadStatus = "";
    },
    tabChange(item) {
      console.log('item', item);
      this.resetData();
      this.activeIndex = item.index;
      this.activeNum = 0;
      if (this.activeIndex == 0) {
        this.dataList1 = [];
        this.getDataList1()
      } else if (this.activeIndex == 1) {
        this.dataList2 = [];
        this.getDataList2()
      } else {
        this.dataList3 = [];
        this.getDataList3()
      }
    },
    // 时间改变
    changTiem(index) {
      console.log("index:", index)
      this.activeNum = index;
      this.resetData();
      if (this.activeIndex == 0) {
        this.dataList1 = [];
        this.getDataList1()
      } else if (this.activeIndex == 1) {
        this.dataList2 = [];
        this.getDataList2()
      }
    },
    // 状态改变
    changstatusTiem(index) {
      console.log("index:", index)
      this.stateactiveNum = index;
      if (index == 0) {
        this.statusQuery = 2
      } else if (index == 1) {
        this.statusQuery = 1
      } else {
        this.statusQuery = 3
      }
      this.resetData();
      this.dataList3 = [];
      this.getDataList3()
    },
    // changTiem(index){
    // 	console.log("index:", index)
    // 	this.activeNum = index;
    // },
    // 待进行详情
    godetails(id,type) {
      if(type == 'topic_add' || type == 'topic_check'){
        uni.navigateTo({
          url: '/pages/tabbar-3-detial/topicDetails/topicDetails?id=' + id
        });
      } else{
        uni.navigateTo({
          url: '/pages/tabbar-1-detial/meetingDetails/meetingDetails?id=' + id
        });
      }
    },
    // 待审批详情
    // goapprovalDetails() {
    // 	uni.navigateTo({
    // 		url: '/pages/tabbar-1-detial/approvalDetails/approvalDetails'
    // 	});
    // },
    // 议题详情
    gotopicDetails(id) {
      uni.navigateTo({
        url: '/pages/tabbar-3-detial/topicDetails/topicDetails?id=' + id
      });
    },
    // 会议纪要
    gotomeetingMinutes(id) {
      uni.navigateTo({
        url: '/pages/tabbar-3-detial/meetingMinutes/meetingMinutes?id='+id,
      });
    },
  }
}
</script>

<style>
.content {
  background-color: #F8F8F8;
  min-height: 100vh;
}

.u-flex {
  display: flex;
}

.tab-box {
  padding: 20rpx 0;
  background-color: #fff;
  border-bottom: 6rpx solid #F8F8F8;
}

.time-box {
  padding: 28rpx 30rpx;
  display: flex;
  align-items: center;
  font-size: 24rpx;
  font-weight: 500;
  background: #fff;
}

.serach {
  margin-left: auto;
  width: 32rpx;
  height: 32rpx;
}

.tiem-tiem {
  padding: 14rpx 26rpx;
  background: #F3F3F3;
  color: #999999;
  border-radius: 162px 162px 162px 162px;
  opacity: 1;
  margin-right: 28rpx;
}

.active {
  opacity: 1;
  background-color: #fff;
  border: 1px solid #4871C0;
  color: #4871C0;
}

.list {
  padding: 20rpx 24rpx;
}

.list-item {
  padding: 30rpx 24rpx 30rpx 20rpx;
  background-color: #fff;
  border-radius: 16rpx;
  margin-bottom: 20rpx;
  display: flex;
  align-items: flex-start;
}

.item-info {
  margin-left: 10rpx;
  width: 93%;
  /* border: 1px solid; */
}

.item-tile {
  display: flex;
  justify-content: space-between;
}

.title {
  font-size: 32rpx;
  font-weight: bold;
  color: #333333;
  width: 80%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  /* border: 1px solid red; */
}

.title1 {
  width: 100%;
}

.state {
  font-size: 24rpx;
  font-weight: 500;
  padding: 10rpx 12rpx;
}

.state1 {
  color: #8B48C0;
  background: #F8EEFF;
  border-radius: 8rpx;
  opacity: 1;
}

.state2 {
  color: #FF7A00;
  background: #FFECDA;
  border-radius: 8rpx;
  opacity: 1;
}

.state1 {
  color: #8B48C0;
  background: #F8EEFF;
  border-radius: 8rpx;
  opacity: 1;
}

.state2 {
  color: #4871C0;
  background: #EBF1FD;
  border-radius: 8rpx;
  opacity: 1;
}

.state3 {
  color: #999999;
  background: #F5F2F5;
  border-radius: 8rpx;
  opacity: 1;
}

.state4 {
  color: #26B167;
  background: #F2FFF8;
  border-radius: 8rpx;
  opacity: 1;
}

.state5 {
  color: #FA6161;
  background: #FFF0F0;
  border-radius: 8rpx;
  opacity: 1;
}

.state6 {
  color: #FF7A00;
  background: #FFECDA;
  border-radius: 8rpx;
  opacity: 1;
}

.address {
  font-size: 24rpx;
  font-weight: 500;
  color: #666666;
  margin-top: 10rpx;
}

.time {
  font-size: 24rpx;
  font-weight: 500;
  color: #666666;
  margin-top: 10rpx;
}

.item-button {
  text-align: right;
  margin-top: 16rpx;
}

.item-button text {
  text-align: center;
  display: inline-block;
  font-size: 28rpx;
  font-weight: 500;
  color: #FFFFFF;
  width: 186rpx;
  height: 64rpx;
  line-height: 64rpx;
  background: #4871C0;
  border-radius: 16rpx;
  opacity: 1;
  margin-right: 10rpx;
}

.noMore {
  font-size: 18rpx;
  color: #999999;
  text-align: center;
}

.name-text {
  margin: 0 10rpx;
}

.approved-tip {
  margin-top: 18rpx;
  font-size: 24rpx;
  font-weight: 500;
  color: #4871C0;
}

.audit-failed {
  margin-top: 18rpx;
  border-top: 2rpx dashed #ECECEC;
  padding-top: 18rpx;
}

.audit-failed-time {
  font-size: 24rpx;
  font-weight: 500;
  color: #FF7A00;
  margin-bottom: 10rpx;
}

.audit-failed-content {
  font-size: 24rpx;
  font-weight: 500;
  color: #666666;
  line-height: 44rpx;
}
</style>
